@pexip/components

Enumerations

Interfaces

Type Aliases

ActivityCardAction

Ƭ ActivityCardAction: Object

Type declaration

Name	Type
`action?`	() => `void`
`label`	`string`

AlignWithFloatRootTrigger

Ƭ AlignWithFloatRootTrigger: React.MutableRefObject<() => void | null>

AllSize

Ƭ AllSize: typeof allSizesValues[number]

BackgroundImageSrc

Ƭ BackgroundImageSrc: string | BreakpointImageSet

BaseSizeModifier

Ƭ BaseSizeModifier: typeof baseSizeModifiersValues[number]

BreadcrumbItem

Ƭ BreadcrumbItem: Object

Type declaration

Name	Type
`label`	`string`
`url?`	`string`

ButtonHTMLTag

Ƭ ButtonHTMLTag: "button" | "a"

ButtonModifiersValues

Ƭ ButtonModifiersValues: typeof buttonModifiersValues[number]

ButtonProps

Ƭ ButtonProps: React.ComponentProps<typeof Button>

ButtonVariant

Ƭ ButtonVariant: typeof buttonVariantsValues[number]

ColorScheme

Ƭ ColorScheme: typeof colorSchemeValues[number]

DropContentPosition

Ƭ DropContentPosition: typeof dropContentPosition[number]

DropContentType

Ƭ DropContentType: (fn: (e: React.SyntheticEvent<HTMLElement>) => void) => React.ReactNode | React.ReactNode

ExtendedSizeModifier

Ƭ ExtendedSizeModifier: typeof extendedSizeModifiersValues[number]

ExtendedTooltipPosition

FullSizeWindowBackgroundVariant

Ƭ FullSizeWindowBackgroundVariant: typeof fullSizeWindowBackgroundVariantsValues[number]

FullSizeWindowColorBackgroundProps

Ƭ FullSizeWindowColorBackgroundProps: Object

Type declaration

Name	Type
`background?`	`FullSizeWindowBackgroundVariant`
`backgroundBlendMode?`	`never`
`backgroundImageSrc?`	`never`
`overlay?`	`never`
`overlayOpacity?`	`never`

FullSizeWindowImageBackgroundProps

Ƭ FullSizeWindowImageBackgroundProps: Object

Type declaration

Name	Type
`background`	`"image"`
`backgroundBlendMode?`	`BlendMode`
`backgroundImageSrc`	`BackgroundImageSrc`
`overlay?`	`ColorScheme`
`overlayOpacity?`	`OverlayOpacity`

GroupProps

Ƭ GroupProps: React.ComponentProps<typeof Group>

HeadingElement

Ƭ HeadingElement: typeof headingElementsValues[number]

HeadingFontVariant

Ƭ HeadingFontVariant: typeof headingFontVariantsValues[number]

IScrollbars

Ƭ IScrollbars: SimpleBarCore

ImageSrc

Ƭ ImageSrc: string | SrcSet

InlineElement

Ƭ InlineElement: typeof inlineElementsValues[number]

InputVariant

Ƭ InputVariant: typeof inputVariantsValues[number]

InteractiveElementHTMLTag

Ƭ InteractiveElementHTMLTag: "button" | "a" | "div"

InteractiveElementProps

Ƭ InteractiveElementProps: React.ComponentProps<typeof InteractiveElement>

LabelModifier

Ƭ LabelModifier: typeof labelModifierValues[number]

LinkTarget

Ƭ LinkTarget: typeof linkTargetsValues[number]

LogoSizeModifier

Ƭ LogoSizeModifier: typeof logoSizeModifiersValues[number]

MenuAction

Ƭ MenuAction: Object

Type declaration

Name	Type
`enhancerStart?`	`React.ReactNode`
`isDisabled?`	`boolean`
`isLoading?`	`boolean`
`label`	`string`
`onClick?`	() => `void`
`target?`	`LinkTarget`
`testId?`	`string`
`url?`	`string`
`variant?`	`ButtonVariant`

MenuContent

Ƭ MenuContent: MenuItem[][]

MenuItem

Ƭ MenuItem: Object

Type declaration

Name	Type
`clickAction?`	`React.MouseEventHandler`<`HTMLElement`>
`colorScheme?`	`ColorScheme`
`icon?`	`IconSource`
`iconColor?`	`string`
`isAriaChecked?`	`boolean`
`isAriaSelected?`	`boolean`
`isDisabled?`	`boolean`
`isFixedIcon?`	`boolean`
`label`	`React.ReactNode`
`linkWrapper?`	(`{

    children,
}`: { `children`: `React.ReactNode`  }) => `React.ReactElement` |

ModalProps

Ƭ ModalProps: React.ComponentProps<typeof Modal>

MultiselectOption

Ƭ MultiselectOption: Option & { isHidden?: boolean }

MultistepIndicatorProps

Ƭ MultistepIndicatorProps: React.ComponentProps<typeof MultistepIndicator>

NotificationToastMessage

Ƭ NotificationToastMessage: Object

Type declaration

Name	Type	Description
`colorScheme?`	`ColorScheme`	-
`enhanceStart?`	`React.ReactNode`	-
`isClickable?`	`boolean`	-
`isDanger?`	`boolean`	-
`isInterrupt?`	`boolean`	A toast that can interrupt will jump the queue and remove the currently rendering toast and be rendered instead of it. Currently rendering toasts that have a timeout of 0 cannot be interrupted, the toast that tries to interrupt it is discarded and not queued. An example when this can be useful: if many toasts are sent rapidly in response to UI state changes; User mutes, unmute & mutes again and toasts are displayed to reflect these states, the toasts will display without a long timeout between each.
`message`	`ReactNode`	-
`position?`	`ToastPosition`	-
`testid?`	`string`	-
`timeout?`	`number`	-

NotificationToastSignal

Ƭ NotificationToastSignal: NotificationToastMessageSignal | NotificationToastCloseSignal

NotificationTooltipPosition

Option

Ƭ Option: Object

Type declaration

Name	Type
`id`	`string`
`isDisabled?`	`boolean`
`label`	`string`

OverlayOpacity

Ƭ OverlayOpacity: 0 | 0.1 | 0.2 | 0.3 | 0.4 | 0.5 | 0.6 | 0.7 | 0.8 | 0.9 | 1

SelectProps

Ƭ SelectProps: React.ComponentProps<typeof Select>

ShadowModifier

Ƭ ShadowModifier: typeof shadowModifierValues[number]

SizeModifier

Ƭ SizeModifier: typeof sizeModifiersValues[number]

StandardSizeModifier

Ƭ StandardSizeModifier: typeof standardSizeModifiersValues[number]

StatIndicatorVariant

Ƭ StatIndicatorVariant: typeof statIndicatorVariantValues[number]

StatusItem

Ƭ StatusItem: Object

Type declaration

Name	Type
`content`	`string`
`label`	`string`

TagItem

Ƭ TagItem: Object

Type declaration

Name	Type	Description
`className?`	`string`	-
`isInteractive?`	`boolean`	isInteractive decides whether hover effect will be on or off
`isTruncated?`	`boolean`	-
`label?`	`string`	-
`onClick?`	(`label?`: `string`) => `void`	-
`onRemove?`	() => `void`	-
`removeLabel?`	`string`	-
`title?`	`string`	-
`variant?`	`TextVariant`	-

TextLinkProps

Ƭ TextLinkProps: React.ComponentProps<typeof TextLink>

TextProps

Ƭ TextProps: React.ComponentProps<typeof Text>

TextVariant

Ƭ TextVariant: typeof textVariantsValues[number]

ToastPosition

Ƭ ToastPosition: typeof toastPositionValues[number]

TooltipPosition

Ƭ TooltipPosition: typeof TooltipPositionValue[number]

VideoWrapperSizeModifier

Ƭ VideoWrapperSizeModifier: typeof videoWrapperSizeModifiersValues[number]

VideoWrapperVariant

Ƭ VideoWrapperVariant: typeof videoWrapperVariantsValues[number]

Variables

IconTypes

• Const IconTypes: IconCollection

TooltipPositionValue

• Const TooltipPositionValue: readonly ["bottom", "bottomLeft", "bottomRight", "bottomStart", "left", "right", "top", "topLeft", "topRight", "topStart"]

breakpoints

• Const breakpoints: Object

Type declaration

Name	Type
`lg`	`number`
`md`	`number`
`sm`	`number`
`xl`	`number`
`xs`	`number`

notificationToastSignal

• Const notificationToastSignal: Signal<NotificationToastSignal>

Functions

AboutModal

▸ AboutModal(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { closeButtonAriaLabel?: string ; closeOnOutsideClick?: boolean ; colorScheme?: "dark" | "light" ; hasBackground?: boolean ; isOpen: boolean ; modalType?: ModalType ; onClose?: () => void ; padding?: "small" | "medium" | "compact" | "large" | "none" ; sizeModifier?: "small" | "medium" | "compact" | "auto" ; testIdCloseButton?: string ; uniqueTitle?: string ; withCloseButton?: boolean ; withScrollbars?: boolean ; wrapperClassName?: string } & Pick<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { bgColor?: string ; colorScheme?: "dark" | "light" ; footerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; footerPadding?: "small" | "medium" | "compact" | "large" | "none" ; hasBackground?: boolean ; headerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; headerPadding?: "small" | "medium" | "compact" | "large" | "none" ; isRounded?: boolean ; isWithBorder?: boolean ; isWithShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" ; shadowModifier?: "dark" | "light" } & Pick<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { hasFooterShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" }, "hasFooterShadow">, "ref"> & RefAttributes<HTMLDivElement>, "hasFooterShadow" | "headerContent" | "footerContent" | "headerPadding" | "footerPadding"> & { aboutTextEnhancerEnd?: ReactNode ; headingText?: string ; isOpen: boolean ; onClose: (e: SyntheticEvent<Element, Event>) => void ; privacyPolicyLinkText?: string ; privacyPolicyUrl?: string ; termsOfServiceLinkText?: string ; termsOfServiceUrl?: string ; version: string }

context? any

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `closeButtonAriaLabel?`: `string` ; `closeOnOutsideClick?`: `boolean` ; `colorScheme?`: `"dark"` \| `"light"` ; `hasBackground?`: `boolean` ; `isOpen`: `boolean` ; `modalType?`: `ModalType` ; `onClose?`: () => `void` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `sizeModifier?`: `"small"` \| `"medium"` \| `"compact"` \| `"auto"` ; `testIdCloseButton?`: `string` ; `uniqueTitle?`: `string` ; `withCloseButton?`: `boolean` ; `withScrollbars?`: `boolean` ; `wrapperClassName?`: `string` } & `Pick`<`Omit`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `bgColor?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `footerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `footerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `hasBackground?`: `boolean` ; `headerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `headerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `isRounded?`: `boolean` ; `isWithBorder?`: `boolean` ; `isWithShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `shadowModifier?`: `"dark"` \| `"light"` } & `Pick`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasFooterShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }, `"hasFooterShadow"`>, `"ref"`> & `RefAttributes`<`HTMLDivElement`>, `"hasFooterShadow"` \| `"headerContent"` \| `"footerContent"` \| `"headerPadding"` \| `"footerPadding"`> & { `aboutTextEnhancerEnd?`: `ReactNode` ; `headingText?`: `string` ; `isOpen`: `boolean` ; `onClose`: (`e`: `SyntheticEvent`<`Element`, `Event`>) => `void` ; `privacyPolicyLinkText?`: `string` ; `privacyPolicyUrl?`: `string` ; `termsOfServiceLinkText?`: `string` ; `termsOfServiceUrl?`: `string` ; `version`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

AboutText

▸ AboutText(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.enhancerEnd?`	`ReactNode`
`props.headingText?`	`string`
`props.privacyPolicyLinkText?`	`string`
`props.privacyPolicyUrl?`	`string`
`props.termsOfServiceLinkText?`	`string`
`props.termsOfServiceUrl?`	`string`
`props.version`	`string`
`context?`	`any`

Returns

null | ReactElement<any, any>

Accordion

▸ Accordion(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.buttonClassName?`	`string`
`props.canOnlyToggleWithTitle?`	`boolean`
`props.children`	`ReactNode`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.contentClassName?`	`string`
`props.dataTestId?`	`string`
`props.enhancerEnd?`	`ReactNode`
`props.isExpanded?`	`boolean`
`props.meta?`	`ReactNode`
`props.onToggle?`	(`isOpen`: `boolean`) => `void`
`props.title`	`ReactNode`
`context?`	`any`

Returns

null | ReactElement<any, any>

ActionsRow

▸ ActionsRow(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Omit`<`DetailedHTMLProps`<`HTMLAttributes`<`HTMLDivElement`>, `HTMLDivElement`>, `"title"`> & { `children?`: `ReactNode` ; `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `subtitle?`: `string` ; `title`: `ReactNode` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ActivityCard

▸ ActivityCard(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.actionButton`	`ActivityCardAction`
`props.disabled?`	`boolean`
`props.eventsItems`	`ActivityCardAction`[]
`props.eventsTitle`	`string`
`props.statusItems`	`StatusItem`[]
`props.title`	`string`
`props.titleEnhancerStart?`	`ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>>
`context?`	`any`

Returns

null | ReactElement<any, any>

AspectRatio

▸ AspectRatio(props, context?): null | ReactElement<any, any>

A wrapper that makes its children element bound to an aspect ratio. Default ration is 16:9, {width: 16, height: 9}

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `dimensions?`: `Dimensions` ; `isActive?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Audio

▸ Audio(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLAudioElement`> & `AudioHTMLAttributes`<`HTMLAudioElement`> & { `captionsSrc?`: `string` ; `captionsSrcLang?`: `string` ; `controls?`: `boolean` ; `onFailure?`: (`reason`: `unknown`) => `void` ; `onSuccess?`: (`audio`: `null` \| `HTMLAudioElement`) => `void` ; `play?`: `boolean` ; `sinkId?`: `string` ; `src?`: `string` ; `srcObject?`: `MediaStream` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Avatar

▸ Avatar(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props HTMLProps<HTMLDivElement> & { alt?: string ; className?: string ; fontVariant?: FontVariant ; iconSize?: "small" | "medium" | "compact" | "mini" ; iconType?: IconSource ; imageUrl?: string ; isActive?: boolean ; text?: string ; textVariant?: "danger" | "success" | "standard" | "hidden" | "tinted" | "subtle" | "disabled" | "inherit" | "link" | "warning" ; title?: string } & { colorScheme?: "dark" | "light" ; displayName?: string ; isActive?: boolean ; modifier?: RoundIndicatorModifier ; number?: number ; sizeModifier?: "small" | "medium" | "compact" | "large" ; type: AvatarType }

context? any

Name	Type
`props`	`HTMLProps`<`HTMLDivElement`> & { `alt?`: `string` ; `className?`: `string` ; `fontVariant?`: `FontVariant` ; `iconSize?`: `"small"` \| `"medium"` \| `"compact"` \| `"mini"` ; `iconType?`: `IconSource` ; `imageUrl?`: `string` ; `isActive?`: `boolean` ; `text?`: `string` ; `textVariant?`: `"danger"` \| `"success"` \| `"standard"` \| `"hidden"` \| `"tinted"` \| `"subtle"` \| `"disabled"` \| `"inherit"` \| `"link"` \| `"warning"` ; `title?`: `string` } & { `colorScheme?`: `"dark"` \| `"light"` ; `displayName?`: `string` ; `isActive?`: `boolean` ; `modifier?`: `RoundIndicatorModifier` ; `number?`: `number` ; `sizeModifier?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` ; `type`: `AvatarType` }
`context?`	`any`

Returns

null | ReactElement<any, any>

BadgeCounter

▸ BadgeCounter(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `children`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `isTruncated?`: `boolean` ; `isVisible`: `boolean` ; `number`: `number` ; `shouldAnimate?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Bar

▸ Bar(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `flexDirection?`: `"column"` \| `"row"` \| `"rowReverse"` \| `"columnReverse"` ; `justifyContent?`: `"center"` \| `"spaceBetween"` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `position?`: `"relative"` \| `"absoluteTop"` \| `"absoluteBottom"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Box

▸ Box(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { bgColor?: string ; colorScheme?: "dark" | "light" ; footerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; footerPadding?: "small" | "medium" | "compact" | "large" | "none" ; hasBackground?: boolean ; headerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; headerPadding?: "small" | "medium" | "compact" | "large" | "none" ; isRounded?: boolean ; isWithBorder?: boolean ; isWithShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" ; shadowModifier?: "dark" | "light" } & Pick<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { hasFooterShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" }, "hasFooterShadow">, "ref"> & RefAttributes<HTMLDivElement>

Name	Type
`props`	`Omit`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `bgColor?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `footerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `footerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `hasBackground?`: `boolean` ; `headerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `headerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `isRounded?`: `boolean` ; `isWithBorder?`: `boolean` ; `isWithShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `shadowModifier?`: `"dark"` \| `"light"` } & `Pick`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasFooterShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }, `"hasFooterShadow"`>, `"ref"`> & `RefAttributes`<`HTMLDivElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

BoxHeader

▸ BoxHeader(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Breadcrumbs

▸ Breadcrumbs(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.crumbs`	`BreadcrumbItem`[]
`props.handleNavigate`	(`url?`: `string`) => `void`
`context?`	`any`

Returns

null | ReactElement<any, any>

Button

▸ Button(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

CakeTimer

▸ CakeTimer(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`SVGProps`<`SVGSVGElement`> & { `duration?`: `number` }
`context?`	`any`

Returns

null | ReactElement<any, any>

CallToAction

▸ CallToAction(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

Captions

▸ Captions(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	{ `captions?`: `string` ; `className?`: `string` } & `RefAttributes`<`HTMLSpanElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

CardLayout

▸ CardLayout(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props PropsWithChildren<{ colorScheme?: "dark" | "light" ; secondaryComponent: ReactElement<any, string | JSXElementConstructor<any>> ; subtitle?: string | ReactElement<any, string | JSXElementConstructor<any>> ; title: string ; titleEnhancerStart?: ReactElement<any, string | JSXElementConstructor<any>> ; titleHtmlTag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" }>

context? any

Name	Type
`props`	`PropsWithChildren`<{ `colorScheme?`: `"dark"` \| `"light"` ; `secondaryComponent`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `subtitle?`: `string` \| `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `title`: `string` ; `titleEnhancerStart?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `titleHtmlTag?`: `"h1"` \| `"h2"` \| `"h3"` \| `"h4"` \| `"h5"` \| `"h6"` }>
`context?`	`any`

Returns

null | ReactElement<any, any>

Cell

▸ Cell(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasVerticalGutter?`: `boolean` ; `lg?`: `Cells` ; `lgOffset?`: `Cells` ; `md?`: `Cells` ; `mdOffset?`: `Cells` ; `sm?`: `Cells` ; `smOffset?`: `Cells` ; `xl?`: `Cells` ; `xlOffset?`: `Cells` ; `xs?`: `Cells` ; `xsOffset?`: `Cells` }
`context?`	`any`

Returns

null | ReactElement<any, any>

CenterLayout

▸ CenterLayout(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `centerText?`: `boolean` ; `isFullWidth?`: `boolean` ; `position?`: `"absolute"` \| `"relative"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Checkbox

▸ Checkbox(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	`Omit`<`CheckboxProps`, `"ref"`> & `RefAttributes`<`HTMLInputElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

CircleCountDown

▸ CircleCountDown(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.msInterval?`	`number`
`props.shouldStartCountDown?`	`boolean`
`props.startCountFrom?`	`number`
`context?`	`any`

Returns

null | ReactElement<any, any>

ColorPickerPreviewButton

▸ ColorPickerPreviewButton(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Omit`<`DetailedHTMLProps`<`InputHTMLAttributes`<`HTMLInputElement`>, `HTMLInputElement`>, `"onChange"` \| `"type"`> & { `defaultValue?`: `string` ; `label`: `string` ; `onChange`: (`value`: `string`) => `void` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ColorPreviewButton

▸ ColorPreviewButton(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<`Object`>
`context?`	`any`

Returns

null | ReactElement<any, any>

ConfirmableMultiselect

▸ ConfirmableMultiselect(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props Omit<{ className?: string ; colorScheme?: "dark" | "light" ; dropContentPosition?: "topRight" | "topLeft" | "bottomRight" | "bottomLeft" | "topMiddle" | "bottomMiddle" | "middleLeft" | "middleRight" ; errorText?: string ; hasError?: boolean ; iconType?: IconSource ; isDisabled?: boolean ; isFullWidth?: boolean ; isOpen?: boolean ; isTruncated?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; menuComponent: DropContentType ; multipleSelectionText?: string ; noSelectionText?: string ; onContentVisibilityChange?: (isVisible: boolean) => void ; onOutsideClose?: () => void ; options: MultiselectOption[] ; sizeModifier?: "small" | "medium" | "compact" ; testId?: string ; value: undefined | string[] ; wrapContent?: boolean }, "menuComponent"> & { menuTestId?: string ; onConfirm: (selection: MultiselectOption[]) => void ; onContentVisibilityChange?: (isVisible: boolean) => void }

context? any

Name	Type
`props`	`Omit`<{ `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `dropContentPosition?`: `"topRight"` \| `"topLeft"` \| `"bottomRight"` \| `"bottomLeft"` \| `"topMiddle"` \| `"bottomMiddle"` \| `"middleLeft"` \| `"middleRight"` ; `errorText?`: `string` ; `hasError?`: `boolean` ; `iconType?`: `IconSource` ; `isDisabled?`: `boolean` ; `isFullWidth?`: `boolean` ; `isOpen?`: `boolean` ; `isTruncated?`: `boolean` ; `label`: `string` ; `labelModifier?`: `"hidden"` \| `"inline"` ; `menuComponent`: `DropContentType` ; `multipleSelectionText?`: `string` ; `noSelectionText?`: `string` ; `onContentVisibilityChange?`: (`isVisible`: `boolean`) => `void` ; `onOutsideClose?`: () => `void` ; `options`: `MultiselectOption`[] ; `sizeModifier?`: `"small"` \| `"medium"` \| `"compact"` ; `testId?`: `string` ; `value`: `undefined` \| `string`[] ; `wrapContent?`: `boolean` }, `"menuComponent"`> & { `menuTestId?`: `string` ; `onConfirm`: (`selection`: `MultiselectOption`[]) => `void` ; `onContentVisibilityChange?`: (`isVisible`: `boolean`) => `void` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ConfirmationModal

▸ ConfirmationModal(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { closeButtonAriaLabel?: string ; closeOnOutsideClick?: boolean ; colorScheme?: "dark" | "light" ; hasBackground?: boolean ; isOpen: boolean ; modalType?: ModalType ; onClose?: () => void ; padding?: "small" | "medium" | "compact" | "large" | "none" ; sizeModifier?: "small" | "medium" | "compact" | "auto" ; testIdCloseButton?: string ; uniqueTitle?: string ; withCloseButton?: boolean ; withScrollbars?: boolean ; wrapperClassName?: string } & Pick<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { bgColor?: string ; colorScheme?: "dark" | "light" ; footerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; footerPadding?: "small" | "medium" | "compact" | "large" | "none" ; hasBackground?: boolean ; headerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; headerPadding?: "small" | "medium" | "compact" | "large" | "none" ; isRounded?: boolean ; isWithBorder?: boolean ; isWithShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" ; shadowModifier?: "dark" | "light" } & Pick<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { hasFooterShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" }, "hasFooterShadow">, "ref"> & RefAttributes<HTMLDivElement>, "hasFooterShadow" | "headerContent" | "footerContent" | "headerPadding" | "footerPadding"> & { cancelButtonTestid?: string ; cancelButtonText?: string ; confirmButtonTestid?: string ; confirmButtonText?: string ; description?: string ; isOpen: boolean ; onCancel?: () => void ; onConfirm: () => void ; title?: string }

context? any

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `closeButtonAriaLabel?`: `string` ; `closeOnOutsideClick?`: `boolean` ; `colorScheme?`: `"dark"` \| `"light"` ; `hasBackground?`: `boolean` ; `isOpen`: `boolean` ; `modalType?`: `ModalType` ; `onClose?`: () => `void` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `sizeModifier?`: `"small"` \| `"medium"` \| `"compact"` \| `"auto"` ; `testIdCloseButton?`: `string` ; `uniqueTitle?`: `string` ; `withCloseButton?`: `boolean` ; `withScrollbars?`: `boolean` ; `wrapperClassName?`: `string` } & `Pick`<`Omit`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `bgColor?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `footerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `footerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `hasBackground?`: `boolean` ; `headerContent?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `headerPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `isRounded?`: `boolean` ; `isWithBorder?`: `boolean` ; `isWithShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `shadowModifier?`: `"dark"` \| `"light"` } & `Pick`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasFooterShadow?`: `boolean` ; `padding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }, `"hasFooterShadow"`>, `"ref"`> & `RefAttributes`<`HTMLDivElement`>, `"hasFooterShadow"` \| `"headerContent"` \| `"footerContent"` \| `"headerPadding"` \| `"footerPadding"`> & { `cancelButtonTestid?`: `string` ; `cancelButtonText?`: `string` ; `confirmButtonTestid?`: `string` ; `confirmButtonText?`: `string` ; `description?`: `string` ; `isOpen`: `boolean` ; `onCancel?`: () => `void` ; `onConfirm`: () => `void` ; `title?`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ContextMenu

▸ ContextMenu(props, context?): null | ReactElement<any, any>

ContextMenu will the show the "menu" component as a context menu when the user right clicks on the given child element.

Right or left-clicking outside the child element will close the context menu.

Parameters

Name	Type
`props`	`Object`
`props.children`	`ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>>
`props.menu`	`ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> \| (`props`: { `onClose`: () => `void` }) => `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>>
`context?`	`any`

Returns

null | ReactElement<any, any>

CoreHeader

▸ CoreHeader(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { enhancerEnd?: ReactElement<any, string | JSXElementConstructor<any>> ; enhancerFixedWidth?: boolean ; enhancerMiddle?: ReactElement<any, string | JSXElementConstructor<any>> ; enhancerStart?: ReactElement<any, string | JSXElementConstructor<any>> ; hasBottomBorder?: boolean ; position?: "absolute" | "relative" ; size?: "small" | "medium" | "large" }

context? any

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `enhancerEnd?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `enhancerFixedWidth?`: `boolean` ; `enhancerMiddle?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `enhancerStart?`: `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>> ; `hasBottomBorder?`: `boolean` ; `position?`: `"absolute"` \| `"relative"` ; `size?`: `"small"` \| `"medium"` \| `"large"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

CustomTooltip

▸ CustomTooltip(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & `ControlledTooltip` & { `colorScheme?`: `"dark"` \| `"light"` ; `content`: `ReactNode` ; `isArrowShown?`: `boolean` ; `isHoverEnabled?`: `boolean` ; `mainWrapperClassName?`: `string` ; `position?`: `ExtendedTooltipPosition` ; `testIdInner?`: `string` ; `wrapperClassName?`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Divider

▸ Divider(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `direction?`: `"horizontal"` \| `"vertical"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

DragAndDrop

▸ DragAndDrop(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<{ `className?`: `string` ; `colorScheme`: `"dark"` \| `"light"` ; `hasError?`: `boolean` ; `isDisabled?`: `boolean` ; `onDragOver?`: (`e`: `DragEvent`<`HTMLDivElement`>) => `void` ; `onDrop?`: (`e`: `DragEvent`<`HTMLDivElement`>, `files?`: `File`[], `items?`: `DataTransferItem`[]) => `void` }>
`context?`	`any`

Returns

null | ReactElement<any, any>

DragAndUploadFiles

▸ DragAndUploadFiles(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props { accept?: string ; ariaLabel?: string ; className?: string ; colorScheme?: "dark" | "light" ; hasError?: boolean ; isDisabled?: boolean ; multiple?: boolean ; onChange: ChangeEventHandler<HTMLInputElement> ; onDrop?: (e: DragEvent<HTMLDivElement>, files?: File[], items?: DataTransferItem[]) => void ; subTitle?: string ; title?: string } & RefAttributes<HTMLInputElement>

Name	Type
`props`	{ `accept?`: `string` ; `ariaLabel?`: `string` ; `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `hasError?`: `boolean` ; `isDisabled?`: `boolean` ; `multiple?`: `boolean` ; `onChange`: `ChangeEventHandler`<`HTMLInputElement`> ; `onDrop?`: (`e`: `DragEvent`<`HTMLDivElement`>, `files?`: `File`[], `items?`: `DataTransferItem`[]) => `void` ; `subTitle?`: `string` ; `title?`: `string` } & `RefAttributes`<`HTMLInputElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

Draggable

▸ Draggable(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { alignWithFloatRootTrigger?: AlignWithFloatRootTrigger ; beforeReposition?: (element: HTMLDivElement) => void ; floatRoot?: RefObject<HTMLDivElement> ; isDisabled?: boolean ; onPointerMoveExtra?: (element: HTMLDivElement) => void ; onPointerUpExtra?: (element: HTMLDivElement) => void ; onReposition?: (element: HTMLDivElement, floatRootOverflow: FloatRootOverflow) => void ; shouldCaptureClick?: boolean }, "ref"> & RefAttributes<HTMLDivElement>

Name	Type
`props`	`Omit`<`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `alignWithFloatRootTrigger?`: `AlignWithFloatRootTrigger` ; `beforeReposition?`: (`element`: `HTMLDivElement`) => `void` ; `floatRoot?`: `RefObject`<`HTMLDivElement`> ; `isDisabled?`: `boolean` ; `onPointerMoveExtra?`: (`element`: `HTMLDivElement`) => `void` ; `onPointerUpExtra?`: (`element`: `HTMLDivElement`) => `void` ; `onReposition?`: (`element`: `HTMLDivElement`, `floatRootOverflow`: `FloatRootOverflow`) => `void` ; `shouldCaptureClick?`: `boolean` }, `"ref"`> & `RefAttributes`<`HTMLDivElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

DropContent

▸ DropContent(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children"> & { buttonClassName?: string ; buttonLabel?: string ; canCloseOutside?: boolean ; children?: ReactNode | (isOpen: boolean) => ReactNode ; content: DropContentType ; contentClassName?: string ; dropContentRole?: string ; interactiveElement?: (buttonProps: DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, isContentVisible: boolean) => ReactNode ; isContentTextWrapped?: boolean ; isDisabled?: boolean ; isOpen?: boolean ; limitSize?: boolean ; onClose?: () => void ; onContainerClick?: () => void ; onContentVisibilityChange?: (isVisible: boolean) => void ; onOutsideClose?: () => void ; position?: "topRight" | "topLeft" | "bottomRight" | "bottomLeft" | "topMiddle" | "bottomMiddle" | "middleLeft" | "middleRight" }

context? any

Name	Type
`props`	`Omit`<`DetailedHTMLProps`<`ButtonHTMLAttributes`<`HTMLButtonElement`>, `HTMLButtonElement`>, `"children"`> & { `buttonClassName?`: `string` ; `buttonLabel?`: `string` ; `canCloseOutside?`: `boolean` ; `children?`: `ReactNode` \| (`isOpen`: `boolean`) => `ReactNode` ; `content`: `DropContentType` ; `contentClassName?`: `string` ; `dropContentRole?`: `string` ; `interactiveElement?`: (`buttonProps`: `DetailedHTMLProps`<`ButtonHTMLAttributes`<`HTMLButtonElement`>, `HTMLButtonElement`>, `isContentVisible`: `boolean`) => `ReactNode` ; `isContentTextWrapped?`: `boolean` ; `isDisabled?`: `boolean` ; `isOpen?`: `boolean` ; `limitSize?`: `boolean` ; `onClose?`: () => `void` ; `onContainerClick?`: () => `void` ; `onContentVisibilityChange?`: (`isVisible`: `boolean`) => `void` ; `onOutsideClose?`: () => `void` ; `position?`: `"topRight"` \| `"topLeft"` \| `"bottomRight"` \| `"bottomLeft"` \| `"topMiddle"` \| `"bottomMiddle"` \| `"middleLeft"` \| `"middleRight"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ExpanderCell

▸ ExpanderCell(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

FileUpload

▸ FileUpload(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	{ `accept?`: `string` ; `ariaLabel?`: `string` ; `children?`: `ReactNode` ; `className?`: `string` ; `colorScheme`: `"dark"` \| `"light"` ; `id?`: `string` ; `isDisabled?`: `boolean` ; `multiple?`: `boolean` ; `onChange`: `ChangeEventHandler`<`HTMLInputElement`> ; `testId?`: `string` } & `RefAttributes`<`HTMLInputElement`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

Form

▸ Form(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`DetailedHTMLProps`<`FormHTMLAttributes`<`HTMLFormElement`>, `HTMLFormElement`>
`context?`	`any`

Returns

null | ReactElement<any, any>

FullSizeWindow

▸ FullSizeWindow(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	`Object`

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

FullscreenLayout

▸ FullscreenLayout(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children?`	`ReactNode`
`context?`	`any`

Returns

null | ReactElement<any, any>

FullscreenOverlay

▸ FullscreenOverlay(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children?`	`ReactNode`
`context?`	`any`

Returns

null | ReactElement<any, any>

FullscreenSpinner

▸ FullscreenSpinner(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

Grid

▸ Grid(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasCellVerticalGutter?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Group

▸ Group(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `justifyContent?`: `"center"` \| `"normal"` \| `"spaceBetween"` ; `modifier?`: `"fullWidth"` ; `spacing?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Heading

▸ Heading(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.padding?`	`"small"` \| `"medium"`
`props.subtitle?`	`string`
`props.title`	`string`
`props.titleFontVariant?`	`H1` \| `H2` \| `H3` \| `H4` \| `H5` \| `H6`
`props.titleHtmlTag?`	`"h1"` \| `"h2"` \| `"h3"` \| `"h4"` \| `"h5"` \| `"h6"`
`context?`	`any`

Returns

null | ReactElement<any, any>

Icon

▸ Icon(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`SVGProps`<`SVGSVGElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `size?`: `"small"` \| `"medium"` \| `"compact"` \| `"mini"` ; `source`: `IconSource` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ImagePreviewButton

▸ ImagePreviewButton(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<`Object`>
`context?`	`any`

Returns

null | ReactElement<any, any>

InfoHeadCell

▸ InfoHeadCell(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.enhanceEnd?`	`ReactNode`
`props.enhanceStart?`	`ReactNode`
`props.title`	`string`
`context?`	`any`

Returns

null | ReactElement<any, any>

InfoMessage

▸ InfoMessage(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.text?`	`string`
`context?`	`any`

Returns

null | ReactElement<any, any>

Input

▸ Input(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & { ref?: null | (instance: null | HTMLInputElement) => void | RefObject<HTMLInputElement> }, "disabled"> & { clearButtonText?: string ; colorScheme?: "dark" | "light" ; enhancerEnd?: ReactNode ; enhancerStart?: ReactNode ; errorText?: string ; hasError?: boolean ; id?: string ; isDisabled?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; name: string ; onClear?: (value: string) => void ; onValueChange?: (value: string) => void ; showClearButton?: boolean ; sizeModifier?: "small" | "medium" ; testId?: string ; type?: TextLikeInputType ; value?: string ; variant?: "transparent" | "standard" }, "ref"> & RefAttributes<{ focus: () => void }>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

InputLabel

▸ InputLabel(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.fontVariant?`	`LabelFontVariant`
`props.form?`	`string`
`props.id?`	`string`
`props.isLabelHidden?`	`boolean`
`props.isLabelInline?`	`boolean`
`props.isUppercase?`	`boolean`
`props.text`	`string`
`props.variant?`	`"danger"` \| `"success"` \| `"standard"` \| `"hidden"` \| `"tinted"` \| `"subtle"` \| `"disabled"` \| `"inherit"` \| `"link"` \| `"warning"`
`context?`	`any`

Returns

null | ReactElement<any, any>

InteractiveElement

▸ InteractiveElement(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

KebabMenuButton

▸ KebabMenuButton(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props PropsWithChildren<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "children"> & { buttonClassName?: string ; buttonLabel?: string ; canCloseOutside?: boolean ; children?: ReactNode | (isOpen: boolean) => ReactNode ; content: DropContentType ; contentClassName?: string ; dropContentRole?: string ; interactiveElement?: (buttonProps: DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, isContentVisible: boolean) => ReactNode ; isContentTextWrapped?: boolean ; isDisabled?: boolean ; isOpen?: boolean ; limitSize?: boolean ; onClose?: () => void ; onContainerClick?: () => void ; onContentVisibilityChange?: (isVisible: boolean) => void ; onOutsideClose?: () => void ; position?: "topRight" | "topLeft" | "bottomRight" | "bottomLeft" | "topMiddle" | "bottomMiddle" | "middleLeft" | "middleRight" }, "content"> & { buttonModifier?: "fullWidth" | "square" | "fluid" | "disc" ; buttonSize?: "small" | "medium" | "compact" | "large" | "none" ; buttonVariant?: "primary" | "secondary" | "tertiary" | "neutral" | "translucent" | "bordered" | "transparent" | "text" | "danger" | "dangerBordered" | "success" | "obvious" ; className?: string ; direction?: "horizontal" | "vertical" ; isDisabled?: boolean ; label?: string ; menuComponent: DropContentType ; menuPosition?: "topRight" | "topLeft" | "bottomRight" | "bottomLeft" | "topMiddle" | "bottomMiddle" | "middleLeft" | "middleRight" ; reactiveButtonStyles?: boolean }>

context? any

Returns

null | ReactElement<any, any>

LineHeading

▸ LineHeading(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children`	`ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`>>
`context?`	`any`

Returns

null | ReactElement<any, any>

List

▸ List(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `spacing?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

ListBoxLink

▸ ListBoxLink(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

ListLink

▸ ListLink(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

Logo

▸ Logo(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLImageElement`> & `ImgHTMLAttributes`<`HTMLImageElement`> & { `alt`: `string` ; `className?`: `string` ; `imageSrc`: `ImageSrc` }
`context?`	`any`

Returns

null | ReactElement<any, any>

▸ Menu(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.isAriaMultiSelectable?`	`boolean`
`props.menuContent`	`TitledMenuContent` \| `MenuContent`
`props.onPointerDownCapture?`	`PointerEventHandler`<`HTMLDivElement`>
`props.role?`	`AriaRole`
`props.tabIndex?`	`number`
`props.testId?`	`string`
`props.wrapperComponent?`	`FC`<`PropsWithChildren`<{ `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `testId?`: `string` }>>
`context?`	`any`

Returns

null | ReactElement<any, any>

MenuEntry

▸ MenuEntry(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.item`	`MenuItem`
`context?`	`any`

Returns

null | ReactElement<any, any>

▸ Modal(props, context?): null | ReactElement<any, any>

Parameters

Name Type

context? any

Returns

null | ReactElement<any, any>

ModalCloseButton

▸ ModalCloseButton(props, context?): null | ReactElement<any, any>

A generic close button for modals, tooltips and pill toasts.

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.onClose?`	`ClickEventHandler`<`Element`, `Event`>
`context?`	`any`

Returns

null | ReactElement<any, any>

Multiselect

▸ Multiselect(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props Omit<{ className?: string ; colorScheme?: "dark" | "light" ; dropContentPosition?: "topRight" | "topLeft" | "bottomRight" | "bottomLeft" | "topMiddle" | "bottomMiddle" | "middleLeft" | "middleRight" ; errorText?: string ; hasError?: boolean ; iconType?: IconSource ; isDisabled?: boolean ; isFullWidth?: boolean ; isOpen?: boolean ; isTruncated?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; menuComponent: DropContentType ; multipleSelectionText?: string ; noSelectionText?: string ; onContentVisibilityChange?: (isVisible: boolean) => void ; onOutsideClose?: () => void ; options: MultiselectOption[] ; sizeModifier?: "small" | "medium" | "compact" ; testId?: string ; value: undefined | string[] ; wrapContent?: boolean }, "menuComponent"> & { menuTestId?: string ; onSelectChange: (selection: MultiselectOption[]) => void }

context? any

Returns

null | ReactElement<any, any>

MultistepIndicator

▸ MultistepIndicator(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.currentStepIndex?`	`number`
`props.isStepNameHidden?`	`boolean`
`props.isStepNameTruncated?`	`boolean`
`props.onStepChange?`	(`stepNumber`: `number`) => `void`
`props.stepClassName?`	`string`
`props.steps`	`MultistepItem`[]
`props.variant?`	`"ordered-list"` \| `"line"`
`context?`	`any`

Returns

null | ReactElement<any, any>

NotificationToast

▸ NotificationToast(props, context?): null | ReactElement<any, any>

The NotificationToast component works like a normal toast, except it displays data received via a signal, and it stores the messages as an array, displaying one at a time.

Consumers can add a new message by doing:

    notificationToast.emit([{ message: 'My message' }]);

Parameters

Name	Type
`props`	`Partial`<`ToastProps`>
`context?`	`any`

Returns

null | ReactElement<any, any>

NotificationTooltip

▸ NotificationTooltip(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & ControlledTooltip & { closeButtonAriaLabel?: string ; colorScheme?: "dark" | "light" ; ctaFn?: () => void ; ctaText?: string ; header: string ; isArrowShown?: boolean ; mainWrapperClassName?: string ; modifier?: "fullWidth" ; position?: NotificationTooltipPosition ; stopPointerDownPropagation?: boolean ; testIdCloseButton?: string ; testIdInner?: string ; text: string | ReactElement<any, string | JSXElementConstructor<any>> }

context? any

Returns

null | ReactElement<any, any>

NumberStepInput

▸ NumberStepInput(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.isDisabled?`	`boolean`
`props.isInputReadOnly?`	`boolean`
`props.label`	`string`
`props.labelDecrement?`	`ReactNode`
`props.labelIncrement?`	`ReactNode`
`props.maxValue?`	`number`
`props.minValue?`	`number`
`props.name`	`string`
`props.onChange`	(`value`: `number`) => `void`
`props.value?`	`number`
`context?`	`any`

Returns

null | ReactElement<any, any>

Panel

▸ Panel(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props { children?: ReactNode } & { fillHeight?: boolean } & Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { bgColor?: string ; colorScheme?: "dark" | "light" ; footerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; footerPadding?: "small" | "medium" | "compact" | "large" | "none" ; hasBackground?: boolean ; headerContent?: ReactElement<any, string | JSXElementConstructor<any>> ; headerPadding?: "small" | "medium" | "compact" | "large" | "none" ; isRounded?: boolean ; isWithBorder?: boolean ; isWithShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" ; shadowModifier?: "dark" | "light" } & Pick<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { hasFooterShadow?: boolean ; padding?: "small" | "medium" | "compact" | "large" | "none" }, "hasFooterShadow">, "ref"> & RefAttributes<HTMLDivElement>

context? any

Returns

null | ReactElement<any, any>

PasswordInput

▸ PasswordInput(props, context?): null | ReactElement<any, any>

The PasswordInput is a normal Input element that can toggle between password and text type with a show/hide button.

Parameters

Name Type

props Omit<Omit<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & { ref?: null | (instance: null | HTMLInputElement) => void | RefObject<HTMLInputElement> }, "disabled"> & { clearButtonText?: string ; colorScheme?: "dark" | "light" ; enhancerEnd?: ReactNode ; enhancerStart?: ReactNode ; errorText?: string ; hasError?: boolean ; id?: string ; isDisabled?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; name: string ; onClear?: (value: string) => void ; onValueChange?: (value: string) => void ; showClearButton?: boolean ; sizeModifier?: "small" | "medium" ; testId?: string ; type?: TextLikeInputType ; value?: string ; variant?: "transparent" | "standard" }, "ref"> & RefAttributes<{ focus: () => void }>, "type">

context? any

Returns

null | ReactElement<any, any>

PexipLogo

▸ PexipLogo(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`SVGProps`<`SVGSVGElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `position?`: `"absoluteCenter"` ; `size?`: `"small"` \| `"medium"` \| `"large"` \| `"full"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Pill

▸ Pill(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `closeButtonAriaLabel?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `isDanger?`: `boolean` ; `onClose?`: `ClickEventHandler`<`Element`, `Event`> ; `testIdCloseButton?`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

PopOutWindow

▸ PopOutWindow(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children`	`ReactNode`
`props.onUnload?`	() => `void`
`props.remotePopOut?`	`Window`
`props.title?`	`string`
`context?`	`any`

Returns

null | ReactElement<any, any>

PreferenceInput

▸ PreferenceInput(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.confirmLabel?`	`string`
`props.denyAlertText?`	`string`
`props.denyLabel?`	`string`
`props.errorText?`	`string`
`props.hasError?`	`boolean`
`props.id?`	`string`
`props.initialValue?`	`string`
`props.isConfirmDisabled?`	`boolean`
`props.isEditing?`	`boolean`
`props.isReadOnly?`	`boolean`
`props.label`	`string`
`props.labelEnhanceEnd?`	`ReactNode`
`props.modifyLabel?`	`string`
`props.name`	`string`
`props.onChange?`	(`e`: `ChangeEvent`<`HTMLInputElement`>) => `void`
`props.onConfirm?`	(`value?`: `string` \| `number`) => `void`
`props.onEditingStateChange?`	(`isEditing`: `boolean`) => `void`
`props.overrideInputValue?`	`string`
`props.placeholder?`	`string`
`props.shouldShowDenyAlert?`	`boolean`
`props.type?`	`"number"` \| `"text"` \| `"tel"` \| `"url"` \| `"email"` \| `"password"`
`context?`	`any`

Returns

null | ReactElement<any, any>

PreferenceMultiselect

▸ PreferenceMultiselect(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.confirmLabel?`	`string`
`props.denyAlertText?`	`string`
`props.denyLabel?`	`string`
`props.errorText?`	`string`
`props.hasError?`	`boolean`
`props.isEditing?`	`boolean`
`props.isReadOnly?`	`boolean`
`props.label`	`string`
`props.labelEnhanceEnd?`	`ReactNode`
`props.modifyLabel?`	`string`
`props.noSelectionLabel?`	`string`
`props.onChange?`	(`selection`: `Option`[]) => `void`
`props.onConfirm?`	(`selection`: `Option`[]) => `void`
`props.options?`	`Option`[]
`props.shouldShowDenyAlert?`	`boolean`
`props.value?`	`string`[]
`context?`	`any`

Returns

null | ReactElement<any, any>

PreferenceRow

▸ PreferenceRow(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props PropsWithChildren<PropsWithChildren<{ className?: string ; description?: ReactNode ; descriptionVariant?: "danger" | "success" | "standard" | "hidden" | "tinted" | "subtle" | "disabled" | "inherit" | "link" | "warning" ; label?: ReactNode ; labelVariant?: "danger" | "success" | "standard" | "hidden" | "tinted" | "subtle" | "disabled" | "inherit" | "link" | "warning" ; rowBottom?: ReactNode ; rowLeft?: ReactNode ; withBorderBottom?: boolean }>>

context? any

Returns

null | ReactElement<any, any>

PreferenceWrapper

▸ PreferenceWrapper(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children?`	`ReactNode`
`props.className?`	`string`
`props.errorText?`	`string`
`props.hasError?`	`boolean`
`props.label`	`string`
`props.labelEnhanceEnd?`	`ReactNode`
`context?`	`any`

Returns

null | ReactElement<any, any>

ProgressBar

▸ ProgressBar(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `backgroundClassName?`: `string` ; `barClassName?`: `string` ; `barColor?`: `ProgressBarColor` ; `colorScheme?`: `"dark"` \| `"light"` ; `progress`: `number` }
`context?`	`any`

Returns

null | ReactElement<any, any>

RadioButton

▸ RadioButton(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<Omit<HTMLProps<HTMLInputElement>, "disabled" | "name" | "type"> & { checked?: boolean ; className?: string ; colorScheme?: "dark" | "light" ; groupName?: string ; id?: string ; isDisabled?: boolean ; label: string ; labelModifier?: "hidden" | "default" | "spaced" ; labelPosition?: "end" | "start" ; onValueChange?: (selected: boolean) => void ; value: string }, "ref"> & RefAttributes<HTMLInputElement>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

RangeSlider

▸ RangeSlider(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.max?`	`number`
`props.min?`	`number`
`props.onChange?`	(`e`: `ChangeEvent`<`HTMLInputElement`>) => `void`
`props.selectedValue?`	`number`
`props.step?`	`number`
`context?`	`any`

Returns

null | ReactElement<any, any>

Row

▸ Row(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `spacing?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Scrim

▸ Scrim(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `position?`: `"bottom"` \| `"top"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Scrollbars

▸ Scrollbars(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	`Omit`<`Props`, `"autoHide"`> & { `autoHide?`: `AutoHideBehavior` ; `children?`: `ReactNode` ; `className?`: `string` ; `onScroll?`: (`e`: `Event`) => `void` } & `RefAttributes`<`default`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

Section

▸ Section(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLElement`> & `HTMLAttributes`<`HTMLElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `subtitle`: `ReactNode` ; `title`: `string` ; `variant?`: `"danger"` \| `"success"` \| `"standard"` \| `"hidden"` \| `"tinted"` \| `"subtle"` \| `"disabled"` \| `"inherit"` \| `"link"` \| `"warning"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

SectionAccordion

▸ SectionAccordion(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.buttonClassName?`	`string`
`props.children?`	`ReactNode`
`props.className?`	`string`
`props.collapseText?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.expandText?`	`string`
`props.isExpanded?`	`boolean`
`props.onToggle?`	(`isOpen`: `boolean`) => `void`
`props.subtitle?`	`ReactNode`
`props.title`	`string`
`props.titleEnhancerEnd?`	`ReactNode`
`context?`	`any`

Returns

null | ReactElement<any, any>

Select

▸ Select(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props Omit<Omit<DetailedHTMLProps<SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & { ref?: null | (instance: null | HTMLSelectElement) => void | RefObject<HTMLSelectElement> }, "disabled"> & { colorScheme?: "dark" | "light" ; errorText?: string ; errorTextTestId?: string ; hasError?: boolean ; iconType?: IconSource ; id?: string ; isDisabled?: boolean ; isFullWidth?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; onValueChange: (id: string) => void ; options: Option[] ; sizeModifier?: "small" | "medium" | "compact" ; value: string ; wrapContent?: boolean }

context? any

Returns

null | ReactElement<any, any>

Sheet

▸ Sheet(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `isOpen`: `boolean` ; `onClose`: () => `void` ; `withCloseButton?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

SortingIndicator

▸ SortingIndicator(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<{ `isSortDescending?`: `boolean` }>
`context?`	`any`

Returns

null | ReactElement<any, any>

Spinner

▸ Spinner(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `label?`: `string` ; `sizeModifier?`: `"small"` \| `"medium"` \| `"compact"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

StatCard

▸ StatCard(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.colorScheme?`	`"dark"` \| `"light"` \| `"danger"`
`props.hasDivider?`	`boolean`
`props.rowBottom?`	`StatCardRow`
`props.rowTop`	`StatCardRow`
`props.shadowModifier?`	`"dark"` \| `"light"`
`context?`	`any`

Returns

null | ReactElement<any, any>

StatIndicator

▸ StatIndicator(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `color?`: `string` ; `size?`: `"small"` \| `"large"` ; `type?`: `"circle"` \| `"arrowUp"` \| `"arrowDown"` ; `variant?`: `"danger"` \| `"success"` \| `"busy"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

StepNumber

▸ StepNumber(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `children?`: `undefined` ; `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `isActive?`: `boolean` ; `isCompleted?`: `boolean` ; `isDisabled?`: `boolean` ; `stepNumber`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

SvgImage

▸ SvgImage(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`SVGProps`<`SVGSVGElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `size?`: `"small"` \| `"medium"` ; `source`: `ElementType`<`any`> }
`context?`	`any`

Returns

null | ReactElement<any, any>

Tab

▸ Tab(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `contentPadding?`: `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` ; `tabEnhancerEnd?`: `ReactNode` ; `tabEnhancerStart?`: `ReactNode` ; `title`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Table

▸ Table(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasPinnedColumns?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

TableBody

▸ TableBody(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `hasInfinityScroll?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

TableCell

▸ TableCell(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `isOnlyShownOnHover?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

TableContent

▸ TableContent(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`DetailedHTMLProps`<`HTMLAttributes`<`HTMLDivElement`>, `HTMLDivElement`>
`context?`	`any`

Returns

null | ReactElement<any, any>

TableHead

▸ TableHead(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`DetailedHTMLProps`<`HTMLAttributes`<`HTMLDivElement`>, `HTMLDivElement`>
`context?`	`any`

Returns

null | ReactElement<any, any>

TableHeadCell

▸ TableHeadCell(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `isDisabled?`: `boolean` ; `isSorted?`: `boolean` }
`context?`	`any`

Returns

null | ReactElement<any, any>

TablePagination

▸ TablePagination(props, context?): null | ReactElement<any, any>

Parameters

Name	Type	Description
`props`	`Object`	-
`props.canNextPage`	`boolean`	-
`props.canPreviousPage`	`boolean`	-
`props.currentPageSize`	`number`	Number of entries for the current page.
`props.gotoPage`	(`updater`: `number` \| (`pageIndex`: `number`) => `number`) => `void`	-
`props.isDisabled?`	`boolean`	-
`props.isTablePopulated?`	`boolean`	-
`props.label`	`string`	-
`props.nextPage`	() => `void`	-
`props.pageIndex`	`number`	Current page number.
`props.pageLength`	`number`	Number of visible page buttons.
`props.pageSize`	`number`	Number of entries per page.
`props.previousPage`	() => `void`	-
`props.showResultsCount?`	`boolean`	-
`props.totalRows`	`number`	Sum of entries of all pages combined.
`context?`	`any`	-

Returns

null | ReactElement<any, any>

TableRow

▸ TableRow(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children`	`ReactNode`
`props.className?`	`string`
`props.isDisabled?`	`boolean`
`props.isSelected?`	`boolean`
`props.style?`	`CSSProperties`
`context?`	`any`

Returns

null | ReactElement<any, any>

TableRowWrapper

▸ TableRowWrapper(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.children`	`ReactNode`
`props.className?`	`string`
`props.isDisabled?`	`boolean`
`props.isSelected?`	`boolean`
`props.style?`	`CSSProperties`
`context?`	`any`

Returns

null | ReactElement<any, any>

TableSection

▸ TableSection(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `position?`: `"middle"` \| `"left-pinned"` \| `"right-pinned"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

Tabs

▸ Tabs(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { children: ReactElement<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { contentPadding?: "small" | "medium" | "compact" | "large" | "none" ; tabEnhancerEnd?: ReactNode ; tabEnhancerStart?: ReactNode ; title: string }, string | JSXElementConstructor<any>> | (false | ReactElement<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { contentPadding?: "small" | "medium" | "compact" | "large" | "none" ; tabEnhancerEnd?: ReactNode ; tabEnhancerStart?: ReactNode ; title: string }, string | JSXElementConstructor<any>>)[] ; colorScheme?: "dark" | "light" ; customTabNameComponent?: FC<ClassAttributes<HTMLButtonElement> & ButtonHTMLAttributes<HTMLButtonElement>> ; hasDivider?: boolean ; initialActiveTabIndex?: number ; noTabButtonPadding?: boolean ; onActiveTabChange?: (activeTabIndex: number) => void }

context? any

Returns

null | ReactElement<any, any>

Tag

▸ Tag(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<`TagItem`>
`context?`	`any`

Returns

null | ReactElement<any, any>

▸ TagList(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<{ `className?`: `string` ; `colorScheme?`: `"dark"` \| `"light"` ; `items`: `TagItem`[] ; `maxTagsCount?`: `number` ; `variant?`: `"danger"` \| `"success"` \| `"standard"` \| `"hidden"` \| `"tinted"` \| `"subtle"` \| `"disabled"` \| `"inherit"` \| `"link"` \| `"warning"` }>
`context?`	`any`

Returns

null | ReactElement<any, any>

Text

▸ Text(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

TextArea

▸ TextArea(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<Omit<Omit<DetailedHTMLProps<TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & { ref?: null | (instance: null | HTMLTextAreaElement) => void | RefObject<HTMLTextAreaElement> }, "disabled"> & { colorScheme?: "dark" | "light" ; errorText?: string ; hasError?: boolean ; id?: string ; isDisabled?: boolean ; isLabelHidden?: boolean ; label: string ; name: string ; onValueChange?: (value: string) => void ; resize?: ResizeVariant ; rows?: number ; value?: string }, "ref"> & RefAttributes<{ focus: () => void }>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

TextHeading

▸ TextHeading(props, context?): null | ReactElement<any, any>

Parameters

Name Type

props ClassAttributes<HTMLHeadingElement> & HTMLAttributes<HTMLHeadingElement> & { className?: string ; colorScheme?: "dark" | "light" ; fontVariant?: FontVariant ; htmlTag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" ; isTruncated?: boolean ; isUppercase?: boolean ; variant?: "danger" | "success" | "standard" | "hidden" | "tinted" | "subtle" | "disabled" | "inherit" | "link" | "warning" }

context? any

Returns

null | ReactElement<any, any>

TextLink

▸ TextLink(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`context?`	`any`

Returns

null | ReactElement<any, any>

ThemeConsumer

▸ ThemeConsumer(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name	Type
`props`	`ConsumerProps`<`ThemeContextProps`>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

ThemeProvider

▸ ThemeProvider(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`PropsWithChildren`<`ThemeContextProps`>
`context?`	`any`

Returns

null | ReactElement<any, any>

Toast

▸ Toast(props): null | Element

Parameters

Name	Type
`props`	`ToastProps` & `WithTransitionProps`

Returns

null | Element

ToggleSwitch

▸ ToggleSwitch(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Omit`<`ToggleSwitchProps`, `"style"` \| `"type"`>
`context?`	`any`

Returns

null | ReactElement<any, any>

▸ Tooltip(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `colorScheme?`: `"dark"` \| `"light"` ; `isTooltipEnabled?`: `boolean` ; `position?`: `"left"` \| `"right"` \| `"bottom"` \| `"top"` \| `"topRight"` \| `"topLeft"` \| `"bottomRight"` \| `"bottomLeft"` \| `"topStart"` \| `"bottomStart"` ; `text`: `ReactNode` ; `tooltipContainerClassName?`: `string` }
`context?`	`any`

Returns

null | ReactElement<any, any>

URLToLink

▸ URLToLink(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.text`	`string`
`context?`	`any`

Returns

null | ReactElement<any, any>

User

▸ User(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`Object`
`props.avatarType`	`AvatarType`
`props.className?`	`string`
`props.colorScheme?`	`"dark"` \| `"light"`
`props.displayName`	`string`
`props.email?`	`string`
`props.imageUrl?`	`string`
`props.order?`	`"text-right"` \| `"text-left"`
`props.size?`	`"small"` \| `"medium"` \| `"compact"` \| `"large"`
`props.textItemClassName?`	`string`
`props.usernameFontVariant?`	`FontVariant`
`context?`	`any`

Returns

null | ReactElement<any, any>

UserMenuDropContent

▸ UserMenuDropContent(props, context?): null | ReactElement<any, any>

Parameters

Name Type

context? any

Returns

null | ReactElement<any, any>

Video

▸ Video(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<ClassAttributes<HTMLVideoElement> & VideoHTMLAttributes<HTMLVideoElement> & { autoPlay?: boolean ; captionsSrc?: string ; captionsSrcLang?: string ; isMirrored?: boolean ; onFailedToResume?: FailedToResume ; onPictureInPictureChange?: (isPip: boolean) => void ; playsInline?: boolean ; sinkId?: string ; srcObject?: MediaStream ; textTrackKind?: "captions" | "subtitles" }, "ref"> & RefAttributes<VideoHandle>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

VideoWrapper

▸ VideoWrapper(props): null | ReactElement<any, string | JSXElementConstructor<any>>

NOTE: Exotic components are not callable.

Parameters

Name Type

props Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & { alignItems?: "center" | "stretch" | "flex-end" | "flex-start" ; background?: "none" | "light" | "primary" | "secondary" | "black" ; border?: boolean ; borderRadius?: "none" | "box" ; flexDirection?: "column" | "row" ; isFullHeight?: boolean ; isFullWidth?: boolean ; justifyContent?: "center" | "flex-end" | "flex-start" ; size?: "small" | "medium" | "large" | "full" }, "ref"> & RefAttributes<HTMLDivElement>

Returns

null | ReactElement<any, string | JSXElementConstructor<any>>

Wrapper

▸ Wrapper(props, context?): null | ReactElement<any, any>

Parameters

Name	Type
`props`	`ClassAttributes`<`HTMLDivElement`> & `HTMLAttributes`<`HTMLDivElement`> & { `borderRadius?`: `"none"` \| `"box"` ; `heightModifier?`: `"autoHeight"` ; `justifyContent?`: `"center"` \| `"flexStart"` ; `modifier?`: `"fullWidth"` \| `"mediumWidth"` ; `size?`: `"small"` \| `"medium"` \| `"large"` \| `"full"` }
`context?`	`any`

Returns

null | ReactElement<any, any>

isBackgroundImageSrcEmpty

▸ isBackgroundImageSrcEmpty(backgroundImageSrc): boolean

Parameters

Name	Type
`backgroundImageSrc`	`undefined` \| `BackgroundImageSrc`

Returns

boolean

isImageSrcEmpty

▸ isImageSrcEmpty(imageSrc): boolean

Parameters

Name	Type
`imageSrc`	`undefined` \| `ImageSrc`

Returns

boolean

isImageSrcString

▸ isImageSrcString(imageSrc): imageSrc is string

Parameters

Name	Type
`imageSrc`	`undefined` \| `ImageSrc`

Returns

imageSrc is string

onEnter

▸ onEnter<E, T>(callback): (e: KeyboardEvent<E>) => void

Type parameters

Name	Type
`E`	extends `HTMLElement`<`E`>
`T`	extends (`e`: `SyntheticEvent`<`E`, `Event`>) => `void`

Parameters

Name	Type
`callback`	`T`

Returns

fn

▸ (e): void

Parameters

Name	Type
`e`	`KeyboardEvent`<`E`>

Returns

void

useBreakpointChange

▸ useBreakpointChange(): Signal<undefined>

Returns

Signal<undefined>

useInput

▸ useInput(props): [string, Omit<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & { ref?: null | (instance: null | HTMLInputElement) => void | RefObject<HTMLInputElement> }, "disabled"> & { clearButtonText?: string ; colorScheme?: "dark" | "light" ; enhancerEnd?: ReactNode ; enhancerStart?: ReactNode ; errorText?: string ; hasError?: boolean ; id?: string ; isDisabled?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; name: string ; onClear?: (value: string) => void ; onValueChange?: (value: string) => void ; showClearButton?: boolean ; sizeModifier?: "small" | "medium" ; testId?: string ; type?: TextLikeInputType ; value?: string ; variant?: "transparent" | "standard" }, "ref"> & RefAttributes<{ focus: () => void }>]

Parameters

Name Type

Returns

[string, Omit<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & { ref?: null | (instance: null | HTMLInputElement) => void | RefObject<HTMLInputElement> }, "disabled"> & { clearButtonText?: string ; colorScheme?: "dark" | "light" ; enhancerEnd?: ReactNode ; enhancerStart?: ReactNode ; errorText?: string ; hasError?: boolean ; id?: string ; isDisabled?: boolean ; label: string ; labelModifier?: "hidden" | "inline" ; name: string ; onClear?: (value: string) => void ; onValueChange?: (value: string) => void ; showClearButton?: boolean ; sizeModifier?: "small" | "medium" ; testId?: string ; type?: TextLikeInputType ; value?: string ; variant?: "transparent" | "standard" }, "ref"> & RefAttributes<{ focus: () => void }>]

useLandscape

▸ useLandscape(): boolean

Returns

boolean

useLg

▸ useLg(): boolean

Returns

boolean

useLgDown

▸ useLgDown(): boolean

Returns

boolean

useLgUp

▸ useLgUp(): boolean

Returns

boolean

useMd

▸ useMd(): boolean

Returns

boolean

useMdDown

▸ useMdDown(): boolean

Returns

boolean

useMdToXl

▸ useMdToXl(): boolean

Returns

boolean

useMdUp

▸ useMdUp(): boolean

Returns

boolean

useMobileDevice

▸ useMobileDevice(): boolean

Returns

boolean

useMultistepIndicator

▸ useMultistepIndicator(«destructured»): readonly [{ allStepsCompleted: boolean ; currentStepIndex: number ; prevStepsCompleted: boolean ; steps: MultistepItem[] }, { moveToStep: (stepIndex: number, __namedParameters: { forceStep?: boolean }) => void ; resetAllSteps: () => void ; resetStep: (stepIndex: number) => void ; updateStepActive: (stepIndex: number, isActive: boolean) => void ; updateStepCompleted: (stepIndex: number, __namedParameters: { activateStep?: boolean ; isCompleted?: boolean }) => void ; updateStepDisabled: (stepIndex: number, isDisabled: boolean) => void }]

Convenience hook for using steps in MultistepIndicator

Parameters

Name	Type
`«destructured»`	`Object`
› `currentStepIndex?`	`number`
› `initialSteps`	`MultistepItem`[]

Returns

readonly [{ allStepsCompleted: boolean ; currentStepIndex: number ; prevStepsCompleted: boolean ; steps: MultistepItem[] }, { moveToStep: (stepIndex: number, __namedParameters: { forceStep?: boolean }) => void ; resetAllSteps: () => void ; resetStep: (stepIndex: number) => void ; updateStepActive: (stepIndex: number, isActive: boolean) => void ; updateStepCompleted: (stepIndex: number, __namedParameters: { activateStep?: boolean ; isCompleted?: boolean }) => void ; updateStepDisabled: (stepIndex: number, isDisabled: boolean) => void }]

usePortrait

▸ usePortrait(): boolean

Returns

boolean

useScrollIntoView

▸ useScrollIntoView(element, options?): () => void

Parameters

Name	Type
`element`	`RefObject`<`HTMLElement`>
`options`	`Object`
`options.delay?`	`number`
`options.scrollIntoViewOptions?`	`Partial`<`ScrollIntoViewOptions`>

Returns

fn

▸ (): void

Returns

void

useSm

▸ useSm(): boolean

Returns

boolean

useSmDown

▸ useSmDown(): boolean

Returns

boolean

useSmToLg

▸ useSmToLg(): boolean

Returns

boolean

useSmToXl

▸ useSmToXl(): boolean

Returns

boolean

useSmUp

▸ useSmUp(): boolean

Returns

boolean

useTabletDevice

▸ useTabletDevice(): boolean

Returns

boolean

useTabs

▸ useTabs(activeTabIndex): Object

Parameters

Name	Type
`activeTabIndex`	`number`

Returns

Object

Name	Type
`activeTab`	`number`
`setActiveTab`	`Dispatch`<`SetStateAction`<`number`>>

useTouchDevice

▸ useTouchDevice(): boolean

Returns

boolean

useXl

▸ useXl(): boolean

Returns

boolean

useXlDown

▸ useXlDown(): boolean

Returns

boolean

useXlUp

▸ useXlUp(): boolean

Returns

boolean

useXs

▸ useXs(): boolean

Returns

boolean

withColorScheme

▸ withColorScheme<P>(Component, colorScheme): (props: P) => Element

Type parameters

Name	Type
`P`	extends `object`

Parameters

Name	Type
`Component`	`ComponentType`<`P`>
`colorScheme`	`"dark"` \| `"light"`

Returns

fn

▸ (props): Element

Parameters

Name	Type
`props`	`P`

Returns

Element

withTabName

▸ withTabName<P>(Component, componentProps?): (props: P & ClassAttributes<HTMLButtonElement> & ButtonHTMLAttributes<HTMLButtonElement>) => Element

Type parameters

Name
`P`

Parameters

Name	Type
`Component`	`ComponentType`<`P`>
`componentProps?`	`P`

Returns

fn

▸ (props): Element

Parameters

Name	Type
`props`	`P` & `ClassAttributes`<`HTMLButtonElement`> & `ButtonHTMLAttributes`<`HTMLButtonElement`>

Returns

Element

withTransition

▸ withTransition<P>(Component, timeout): (props: P & WithTransitionProps) => null | Element

Type parameters

Name	Type
`P`	extends `object`

Parameters

Name	Type
`Component`	`ComponentType`<`P`>
`timeout`	`number`

Returns

fn

▸ (props): null | Element

Parameters

Name	Type
`props`	`P` & `WithTransitionProps`

Returns

null | Element

Enumerations
Interfaces
Type Aliases
Variables
Functions

Enumerations​

Interfaces​

Type Aliases​

ActivityCardAction​

Type declaration​

AlignWithFloatRootTrigger​

AllSize​

BackgroundImageSrc​

BaseSizeModifier​

BreadcrumbItem​

Type declaration​

ButtonHTMLTag​

ButtonModifiersValues​

ButtonProps​

ButtonVariant​

ColorScheme​

DropContentPosition​

DropContentType​

ExtendedSizeModifier​

ExtendedTooltipPosition​

FullSizeWindowBackgroundVariant​

FullSizeWindowColorBackgroundProps​

Type declaration​

FullSizeWindowImageBackgroundProps​

Type declaration​

GroupProps​

HeadingElement​

HeadingFontVariant​

IScrollbars​

ImageSrc​

InlineElement​

InputVariant​

InteractiveElementHTMLTag​

InteractiveElementProps​

LabelModifier​

LinkTarget​

LogoSizeModifier​

MenuAction​

Type declaration​

MenuContent​

MenuItem​

Type declaration​

ModalProps​

MultiselectOption​

MultistepIndicatorProps​

NotificationToastMessage​

Type declaration​

NotificationToastSignal​

NotificationTooltipPosition​

Option​

Type declaration​

OverlayOpacity​

SelectProps​

ShadowModifier​

SizeModifier​

StandardSizeModifier​

StatIndicatorVariant​

StatusItem​

Type declaration​

TagItem​

Type declaration​

TextLinkProps​

TextProps​

TextVariant​

ToastPosition​

TooltipPosition​

VideoWrapperSizeModifier​

VideoWrapperVariant​

Variables​

IconTypes​

TooltipPositionValue​

breakpoints​

Type declaration​

notificationToastSignal​

Functions​

AboutModal​

Parameters​

Returns​

AboutText​

Parameters​

Enumerations

Interfaces

Type Aliases

ActivityCardAction

Type declaration

AlignWithFloatRootTrigger

AllSize

BackgroundImageSrc

BaseSizeModifier

BreadcrumbItem

Type declaration

ButtonHTMLTag

ButtonModifiersValues

ButtonProps

ButtonVariant

ColorScheme

DropContentPosition

DropContentType

ExtendedSizeModifier

ExtendedTooltipPosition

FullSizeWindowBackgroundVariant

FullSizeWindowColorBackgroundProps

Type declaration

FullSizeWindowImageBackgroundProps

Type declaration

GroupProps

HeadingElement

HeadingFontVariant

IScrollbars

ImageSrc

InlineElement

InputVariant

InteractiveElementHTMLTag

InteractiveElementProps

LabelModifier

LinkTarget

LogoSizeModifier

MenuAction

Type declaration

MenuContent

MenuItem

Type declaration

ModalProps

MultiselectOption

MultistepIndicatorProps

NotificationToastMessage

Type declaration

NotificationToastSignal

NotificationTooltipPosition

Option

Type declaration

OverlayOpacity

SelectProps

ShadowModifier

SizeModifier

StandardSizeModifier

StatIndicatorVariant

StatusItem

Type declaration

TagItem

Type declaration

TextLinkProps

TextProps

TextVariant

ToastPosition

TooltipPosition

VideoWrapperSizeModifier

VideoWrapperVariant

Variables

IconTypes

TooltipPositionValue

breakpoints

Type declaration

notificationToastSignal

Functions

AboutModal

Parameters

Returns

AboutText

Parameters